﻿

@charset "utf-8";



.zuperWrap ul,li

{

	margin:0;

	padding:0;

}

/*  ---------------------------------------------

                general properties

    --------------------------------------------- */

/* container used for responsive feature. 

Set here the width and height of slider (for responsive use max-width and min-width; height must have numeric values)

For full screen with responsive feature set:     

	height: 100%;

	width:100%; 

	min-width: 640px; // your min-width value for slider

	position: fixed;

 */

.zuperWrap {	

    height: 570px;

	width:100%;

    margin: 0 auto !important;

	float:left;

}

@media (min-width:1000px) and (max-width: 1190px) {

.zuperWrap 

{

	height:500px !important;

}

}

@media (min-width:960px) and (max-width: 999px) {



.zuperWrap 

{

	height:440px !important;

}

}

@media (min-width:890px) and (max-width: 959px) {



.zuperWrap 

{

	height:400px !important;

}

}

@media (min-width:720px) and (max-width: 889px) {



.zuperWrap 

{

	height:370px !important;

}

}

@media (min-width:600px) and (max-width: 719px) {



.zuperWrap 

{

	height:300px !important;

}

}

@media (min-width:530px) and (max-width: 599px) {



.zuperWrap 

{

	height:250px !important;

}

}

@media (min-width:420px) and (max-width: 529px) {



.zuperWrap 

{

	height:210px !important;

}

}

@media (min-width:350px) and (max-width: 419px) {



.zuperWrap 

{

	height:180px !important;

}

}

@media (min-width:300px) and (max-width: 349px) {



.zuperWrap 

{

	height:140px !important;

}

}

@media (min-width:250px) and (max-width: 299px) {



.zuperWrap 

{

	height:120px !important;

}

}

@media (max-width: 249px) {



.zuperWrap 

{

	height:110px !important;

}

}

/* do not modify. To change the slider width and height please modify zuperWrap class */

.zuperSlider {

    position: absolute;

    height: 570px;    

    width: 100%;	

}



/* hide all children of slider (used for loading screen)*/

.zuperSlider > * {

    visibility: hidden;

}



/* loading screen image and size*/

.zuperSliderLoader {

}



.zuperSlider img {

     display: block;

	 width:100%;

	 height:570px;

}

/*  END - properties */



/*  ---------------------------------------------

				container properties

    --------------------------------------------- */

.zuperSlider > .container {    

    

    

    overflow: hidden;

    position: absolute;

    

    z-index: 1;   

    

    /* change container size and position */

 

    width: 100%;

    height: 570px;

}



/* set container dimension */

.zuperSlider > .container > ul {

    position: absolute;    

    width: 100%;

    height: 100%;      

}



/* style <li>  of container */ 

.zuperSlider > .container > ul > li {

    position: absolute;

    visibility: hidden;

    display: block;

    left: 0;

    top: 0;

    width: 100%;

    height: 570px;

}



/* first child will be above all children */

.zuperSlider > .container > ul > li:nth-child(1) {

     z-index: 2;

}



/* slide active will have class 'active3' */

.zuperSlider > .container > ul > li.active3 {

    visibility: visible;

    overflow: hidden;

    z-index: 4;

}



/* slide animated will have class 'active2' */

.zuperSlider > .container > ul > li.active2 {

     visibility: visible;

     overflow: hidden;

     z-index: 3;

}

/*	END - container properties */





/*  ---------------------------------------------

    direction navigation - arrows (next, prev)

    --------------------------------------------- */

.zuperSlider > .arrow {

    position: absolute;

    z-index: 20;

    cursor: pointer;  

    

    /* change arrows size here */

    height: 93px;

    width: 0;    

}









/*  ---------------------------------------------

    alternative navigation (bullets, numbers or images)

    --------------------------------------------- */

.zuperSlider > .zuperNav {

    position: absolute;

    z-index: -1;

	visibility:hidden !important;

}



/* bullets navigation */

.zuperSlider > .zuperNav > ul.nav > li {

    background: url("../img/zp/sprite.png") no-repeat scroll -36px -50px transparent;

    cursor: pointer;

    float: left;

    margin: 0 2px;

    

    /* change alternative navigation size here (bullets)*/

    width: 14px;

    height: 14px;    

}



/* 'bullets navigation' that is active */

.zuperSlider > .zuperNav > ul.nav > li.active {

     background: url("../img/zp/sprite.png") no-repeat scroll -36px -33px transparent;

}



/* numbers navigation */

.zuperSlider > .zuperNav > ul.nav_num > li {

    background: url("../img/zp/sprite.png") no-repeat scroll -34px -69px transparent;

    color: #0177EA;

    cursor: pointer;

    float: left;

    font: italic 17px/27px Georgia,Arial,Verdana;

    margin: 0 2px;

    text-align: center;



    /* change alternative navigation size here (numbers)*/

    height: 30px;    

    width: 30px;

}



/* 'numbers navigation' that is active */

.zuperSlider > .zuperNav > ul.nav_num > li.active {

    background: url("../img/zp/sprite.png") no-repeat scroll -3px -69px transparent;

    color: #FFFFFF; 

}



/* images navigation (set size with config option from zuperSlider plugin)*/

.zuperSlider > .zuperNav > ul.nav_img > li {

    cursor: pointer;

    float: left;

    margin: 2px;

    opacity: 0.7;

    filter: alpha(opacity = 70);

    overflow: hidden;

    position: relative;

    border: 3px solid #fff;

}



/* 'images navigation' that is active */

.zuperSlider > .zuperNav > ul.nav_img > li.active {

    border: 3px solid #09bbbb;

    opacity: 1;

    filter: alpha(opacity = 100);

}



/* if 'images navigation' has content style it */

.zuperSlider > .zuperNav > ul.nav_img > li > div {

    position: absolute;

    top: 5px;

    left: 5px;

}



/* navigation with thumbs (set size with config option from zuperSlider plugin) */

.zuperSlider .nav_thumb {

     background: url("../img/zp/thumbs_arrow.html") no-repeat scroll center bottom transparent;

     padding-bottom: 5px;

     position: absolute;	 

}



.zuperSlider .nav_thumb > div {

     overflow: hidden;

     border: 5px solid #000;

	 border-radius:2px;

}

/*  END - alternative navigation (bullets, numbers or images) */





/*  ---------------------------------------------

				auto (slideshow)

    --------------------------------------------- */

/* circular type */

.zuperSlider > .circular {

    background: url("../img/zp/sprite.png") no-repeat scroll 0 0 transparent;

    position: absolute;

    z-index: 17;

    

    /* change circular size here */

    width: 30px;

    height: 30px;    

}

.zuperSlider > .circular > .circularWrap {    

    cursor: pointer;

    position: absolute;

    

    /* change circular clip property here */

    clip: rect(0 30px 30px 15px);

    

    /* change circular container size here */

    height: 30px;

    width: 30px;    

}



.zuperSlider > .circular > .circularWrap > .circularRight, 

.zuperSlider > .circular > .circularWrap > .circularLeft {

    position: absolute;

    top: 0;

    left: 0;

    -moz-transform: rotate(-180deg);

    -webkit-transform: rotate(-180deg);

    -o-transform: rotate(-180deg);

    -ms-transform: rotate(-180deg);

    transform: rotate(-180deg);

    

    /* change circular elements size here */

    width: 30px;

    height: 30px;    

}



/* circular left element */

.zuperSlider > .circular > .circularWrap > .circularLeft {

    background: url("../img/zp/sprite.png") no-repeat scroll -31px 0 transparent;

    display: none;

}



/* circular right element */

.zuperSlider > .circular > .circularWrap > .circularRight {

    background: url("../img/zp/sprite.png") no-repeat scroll -61px 0 transparent;

}



/* numbers type */

.zuperSlider > .numbers {

	color: #fff;

	font: italic 26px Georgia,Arial,Verdana;

	position: absolute;

	z-index: 17;

	visibility:hidden !important;

}



/* line type */

.zuperSlider > .wrapTimer {

    position: absolute;

    z-index: 17;    

    overflow: hidden;

    

    /* change line width here (for responsive to work you must insert values in %)*/

    width: 80%;

}



.zuperSlider > .wrapTimer > .timer {

	background: #fff;



	/* change line height here */

	height: 2px;

}



/* play/pause button */

.zuperSlider > .playPause {

	cursor: pointer;     

	position: absolute;     

	z-index: 18;



	/* change play/pause size here */

	width: 13px;

	height: 13px;

}



/* play is visible */



/*  END - auto (slideshow) */





/*  ---------------------------------------------

					caption

    --------------------------------------------- */

.zuperSlider .caption {

	position: absolute;

	z-index: 2;

	opacity: 0;

	filter: alpha(opacity = 0);

}



/* start - captions style */

.captionH1 {

    color: #FEFEFF;

    font: 700 45px 'Rokkitt', serif, Arial;

    width: 87%;

    text-align: right;    

    left: 0;

    top: 39%;

}



.captionH2 {

    color: #FEFEFF;

    font: 700 40px 'Rokkitt', serif, Arial;

    width: 87%;

    text-align: right;    

    left: 0;

    top: 50%;    

}

/*	END - caption */





/*  ---------------------------------------------

    square effect // internal needs (please do not modify)

    --------------------------------------------- */

.zuperSlider > .container > ul > .block {

	overflow: hidden;

	position: absolute;

	z-index: 5;

}



.zuperSlider > .container > ul > .block > li {

    display: block;

    visibility: visible;

    overflow: visible;

    position: absolute;

    width: 100%;

    height: 100%; 

}

/*  END - square effect */





/*  ---------------------------------------------

	used by touch navigation // internal needs (please do not modify)

    --------------------------------------------- */

.zuperSlider .grab * {

    cursor: url(../img/zp/grab.html), move;

    cursor: grab;

    cursor: -moz-grab;

}



.zuperSlider .grabbing * {

    cursor: url(../img/zp/grabbing.html), move !important;

    cursor: grabbing !important;

    cursor: -moz-grabbing !important;

}



.zuperSlider .nonGrab {

    cursor: auto;

}

/*  END - used by touch navigation */	

	

	

/*  ---------------------------------------------

				content style

    --------------------------------------------- */	



/*  END - content style */	